<!DOCTYPE HTML>
<html>
<head>
<title>Home</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Fit Cross Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="applijegleryion/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<!-- Custom Theme files -->
<link href="css/style.css" rel='stylesheet' type='text/css' />	
<script src="js/jquery-1.11.1.min.js"></script>
<!--webfonts-->
<link href='http://fonts.googleapis.com/css?family=Poiret+One|Open+Sans:300italic,400italic,700,300,400' rel='stylesheet' type='text/css'>
<!--//webfonts-->
<script src="js/modernizr.custom.js"></script>
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<!--/script-->
<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){		
					event.preventDefault();
					$('html,body').animate({scrollTop:$(this.hash).offset().top},900);
				});
			});
</script>
			<link rel="stylesheet" href="css/swipebox.css">
				<script src="js/jquery.swipebox.min.js"></script> 
					<script type="text/javascript">
						jQuery(function($) {
							$(".swipebox").swipebox();
						});
			</script>
</head>
<body>
<!--start-home-->
					<ul class="side_nav">
							<li><a class="active scroll" href="#home"></a></li>
								<li><a class="scroll" href="#about"></a></li>
								<li><a class="scroll" href="#trainer"></a></li>
								<li><a class="scroll" href="#service"></a></li>
								<li><a class="scroll" href="#class"></a></li>
								<li><a class="scroll" href="#blog"></a></li>
								<li><a class="scroll" href="#gallery"></a></li>
								<li><a class="scroll" href="#concat"></a></li>
					</ul>
		<div class="banner" id="home">
			<div class="header-top">
				<div class="wrap">	
					<!--top-nav-->
					 <div class="logo">
							  <a href="index.html"><h1>Fit Cross</h1></a>
						  </div>
					<span class="menu"> </span>
					<div class="top-menu">
						<nav>
							<ul class="cl-effect-16">
								<li><a class="active scroll" href="#home" data-hover="Home">Home</a></li>
								<li><a class="scroll" href="#about" data-hover="About">About</a></li>
								<li><a class="scroll" href="#trainer" data-hover="Trainers">Trainers</a></li>
								<li><a class="scroll" href="#service" data-hover="Services">Services</a></li>
								<li><a class="scroll" href="#class" data-hover="Classes">Classes</a></li>
								<li><a class="scroll" href="#blog" data-hover="Blog">Blog</a></li>
								<li><a class="scroll" href="#gallery" data-hover="Gallery">Gallery</a></li>
						        <li><a class="scroll" href="#contact" data-hover="Contact">Contact</a></li>
								<div class="clearfix"></div>
							</ul>
						</nav>		
					</div>

				<!-- script-for-menu -->
								<script>
									$("span.menu").click(function(){
										$(".top-menu ul").slideToggle("slow" , function(){
										});
									});
								</script>
								<!-- script-for-menu -->

				 <div class="clearfix"></div>
			<!-- script-for-menu -->
			       <div class="banner-info">
				     <h2>Skinny isn't sexy, healthy is.</h2>
					 <p>Pain is temporary, quittin' lasts forever.</p>
				   </div>
		    </div>
		  </div>
		<!--banner-->	
		</div>
		<section class="se-container">
				<div class="se-slope" id="about">
					<article class="se-content">
				  <!--start-welcome-->
					 <div class="wel-section" id="welcome">
						<div class="wrap">
							<div class="wel-top">
								<div class="col-md-6 wel-text">
								  <h3 class="tittle wat">Welcome to Our Fit Cross...</h3>
								  <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.Lorem Ipsum has been the industry's standard dummy text ever since,Lorem Ipsum is simply dummy text of the printing and typesetting industry.Lorem Ipsum has been the industry's standard dummy text ever since Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
								  <p>Dolor amet At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia anim</p>
							</div>
							<div class="col-md-6 wel-pic">
									<img src="images/girl.png"/>
							</div>
								<div class="clearfix"> </div>		
							</div>
						</div>
					 </div>
				</div>
				  <!--//about-->
				<div class="se-slope" id="trainer">
					<article class="se-content">
						 <div class="wrap">
						      <h3 class="tittle two">Trainers</h3>
						 <div class="slider">
						  <section class="slider">
							  <div class="flexslider">
								  <ul class="slides">
									<li>
									  <div class="bottom">					                	 
										 <div class=" bottom-in bottom-grid">
											<img class="img-responsive " src="images/s1.jpg" alt="" />  
										 </div>
										<div class=" bottom-in bottom-grid1">
											<img class="img-responsive" src="images/s2.jpg" alt="" />  
										 </div>
										 <div class=" bottom-in bottom-grid2">
											<img class="img-responsive " src="images/s3.jpg" alt="" />  
										</div>
										<div class=" bottom-in bottom-grid3">
											<img class="img-responsive " src="images/s4.jpg" alt="" />  
										</div>
										<div class="clearfix"> </div>										
									</div>
								</li>
								 <li>
									  <div class="bottom">					                	 
										 <div class=" bottom-in bottom-grid">
											<img class="img-responsive " src="images/s3.jpg" alt="" />  
										 </div>
										<div class=" bottom-in bottom-grid1">
											<img class="img-responsive" src="images/s4.jpg" alt="" />  
										 </div>
										 <div class=" bottom-in bottom-grid2">
											<img class="img-responsive " src="images/s1.jpg" alt="" />  
										</div>
										<div class=" bottom-in bottom-grid3">
											<img class="img-responsive " src="images/s2.jpg" alt="" />  
										</div>
										<div class="clearfix"> </div>										
									</div>
								</li>
								 <li>
									  <div class="bottom">					                	 
										 <div class=" bottom-in bottom-grid">
											<img class="img-responsive " src="images/s2.jpg" alt="" />  
										 </div>
										<div class=" bottom-in bottom-grid1">
											<img class="img-responsive" src="images/s1.jpg" alt="" />  
										 </div>
										 <div class=" bottom-in bottom-grid2">
											<img class="img-responsive " src="images/s4.jpg" alt="" />  
										</div>
										<div class=" bottom-in bottom-grid3">
											<img class="img-responsive " src="images/s3.jpg" alt="" />  
										</div>
										<div class="clearfix"> </div>										
									</div>
								</li>
							 </ul>
						</div>
					 </section>
			  <script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.min.js">\x3C/script>')</script>
			  <!--flexslider-->
			  <link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" />
			  <script defer src="js/jquery.flexslider.js"></script>
			  <script type="text/javascript">
			    $(function(){
			      SyntaxHighlighter.all();
			    });
			    $(window).load(function(){
			      $('.flexslider').flexslider({
			        animation: "slide",
			        start: function(slider){
			          $('body').removeClass('loading');
			        }
			      });
			    });
			  </script>

			 </div>
		</div>
		</article>
	</div>
	<div class="se-slope" id="service">
	   <article class="se-content service">
			<h3 class="tittle three">We offer a wide variety of trainings to achieve the best results</h3>
				<div class="wrap">
				   <div class="serve-top">
							<div class="col-md-3 service-grid">
								<div class="icon">
								 <i class="glyphicon glyphicon-heart"></i>
								</div>
								<h5>Cardio Training</h5>
								<p>Sed ut perspiciis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
							</div>
							<div class="col-md-3 service-grid">
								<div class="icon">
								 <i class="glyphicon glyphicon-user"></i>
								</div>
								<h5>Yoga Pilates</h5>
								<p>Sed ut perspiciis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
							</div>
								<div class="col-md-3 service-grid">
								<div class="icon">
								 <i class="glyphicon glyphicon-signal"></i>
								</div>
								<h5>Power Training</h5>
								<p>Sed ut perspiciis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
							</div>
								<div class="col-md-3 service-grid">
								<div class="icon">
								 <i class="glyphicon glyphicon-flash"></i>
								</div>
								<h5>Aerobics</h5>
								<p>Sed ut perspiciis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
							</div>
							<div class="clearfix"></div>
						</div>

					</article>
				</div>
			</div>
	<!--start-class-->
		<div class="se-slope" id="class">
			<article class="se-content">
		      <div class="wrap">
			  <h3 class="tittle three class">Classes</h3>
			  <p>Dolor amet At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident.</p>
			  </div>
	        </article>
	   </div>
	<!--class-->
    <div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >手机网站模板</a></div>	
	<!--start-blogs-->
		<div class="se-slope" id="blog">
			<article class="se-content blog">
		    <div class="wrap">
			   <h3 class="tittle two">Blogs</h3>
			 <div class="news-article">
			 <div class="col-md-4 article-post">
					<div class="post-details">
					  <a href="single.html" class="mask"><img src="images/b2.jpg" alt="image" class="img-responsive zoom-img"></a>
				   </div>
				   <div class="blog-text">
						<a href="single.html"><h4>Blog Post</h4></a>
						 <p>Nam nec tellus a odio tincidunt auctor a ornare odio.Lorem vitae erat consequat auctor elit.</p>
							<div class="read">
								<a class="button" href="single.html"><img src="images/read.png" alt="" /></a>
							</div>
					   </div>
					<div class="date-box">
						<span class="on_date title_shop">Aug 
						<h6>30</h6></span>
					</div>
					<ul class="ad-info">
							 <li><i class="glyphicon glyphicon-calendar"></i>21 Aug'15</li>
							 <li><i class="glyphicon glyphicon-user"></i> <a href="#">Author</a></li>
							 <li><i class="glyphicon glyphicon-comment"></i> <a href="#">24 Comments</a></li>
					</ul>
						<div class="clearfix"> </div>
				<!--post-details-->	
				</div>		
				<div class="col-md-4 article-post">
					<div class="post-details">
					  <a href="single.html" class="mask"><img src="images/b1.jpg" alt="image" class="img-responsive zoom-img"></a>
				   </div>
				   <div class="blog-text">
						<a href="single.html"><h4>Blog Post</h4></a>
						 <p>Nam nec tellus a odio tincidunt auctor a ornare odio.Lorem vitae erat consequat auctor elit.</p>
							<div class="read">
								<a class="button" href="single.html"><img src="images/read.png" alt="" /></a>
							</div>
					   </div>
					<div class="date-box">
						<span class="on_date title_shop">Sep
						<h6>30</h6></span>
					</div>
						<ul class="ad-info">
							 <li><i class="glyphicon glyphicon-calendar"></i>21 Aug'15</li>
							 <li><i class="glyphicon glyphicon-user"></i> <a href="#">Author</a></li>
							 <li><i class="glyphicon glyphicon-comment"></i> <a href="#">24 Comments</a></li>
						</ul>
						<div class="clearfix"> </div>
				<!--post-details-->	
				</div>	
				<div class="col-md-4 article-post">
					<div class="post-details">
					  <a href="single.html" class="mask"><img src="images/b3.jpg" alt="image" class="img-responsive zoom-img"></a>
				   </div>
				   <div class="blog-text">
						<a href="single.html"><h4>Blog Post</h4></a>
						 <p>Nam nec tellus a odio tincidunt auctor a ornare odio.Lorem vitae erat consequat auctor elit.</p>
							<div class="read">
								<a class="button" href="single.html"><img src="images/read.png" alt="" /></a>
							</div>
					   </div>
					<div class="date-box">
						<span class="on_date title_shop">Mar
						<h6>30</h6></span>
					</div>
						<ul class="ad-info">
							 <li><i class="glyphicon glyphicon-calendar"></i>21 Aug'15</li>
							 <li><i class="glyphicon glyphicon-user"></i> <a href="#">Author</a></li>
							 <li><i class="glyphicon glyphicon-comment"></i> <a href="#">24 Comments</a></li>
						</ul>
						<div class="clearfix"> </div>
				<!--post-details-->	
				</div>	
					<div class="clearfix"> </div>				
				</div>
			</div>
	</article>
	</div>
		<!--start-gallery-->
	<div class="se-slope" id="gallery">
		<article class="se-content">
			<div class="gallery" id="gallery">
				<div class="wrap">
				  <h3 class="tittle">Gallery</h3>
						<div class="gallery-bottom">
							 <div class="view view-ninth">
							   <a href="images/g1.jpg" class="b-link-stripe b-animate-go  swipebox"  title="Image Title"><img src="images/g1.jpg" alt="" class="img-responsive">
								<div class="mask mask-1"></div>
								<div class="mask mask-2"></div>
								<div class="content">
									<h3>Fit Cross</h3>
									<p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
									<a href="#" class="info">Read More</a>
								</div>
							</div>
						  <div class="view view-ninth">
							   <a href="images/g2.jpg" class="b-link-stripe b-animate-go  swipebox"  title="Image Title"><img src="images/g2.jpg" alt="" class="img-responsive">
								<div class="mask mask-1"></div>
								<div class="mask mask-2"></div>
								<div class="content">
									<h3>Fit Cross</h3>
									<p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
									<a href="#" class="info">Read More</a>
								</div>
							</div>
							 <div class="view view-ninth">
							   <a href="images/g3.jpg" class="b-link-stripe b-animate-go  swipebox"  title="Image Title"><img src="images/g3.jpg" alt="" class="img-responsive">
								<div class="mask mask-1"></div>
								<div class="mask mask-2"></div>
								<div class="content">
									<h3>Fit Cross</h3>
									<p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
									<a href="#" class="info">Read More</a>
								</div>
							</div>
							<div class="view view-ninth">
							   <a href="images/g4.jpg" class="b-link-stripe b-animate-go  swipebox"  title="Image Title"><img src="images/g4.jpg" alt="" class="img-responsive">
								<div class="mask mask-1"></div>
								<div class="mask mask-2"></div>
								<div class="content">
									<h3>Fit Cross</h3>
									<p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
									<a href="#" class="info">Read More</a>
								</div>
							</div>
						   <div class="view view-ninth">
							   <a href="images/g5.jpg" class="b-link-stripe b-animate-go  swipebox"  title="Image Title"><img src="images/g5.jpg" alt="" class="img-responsive">
								<div class="mask mask-1"></div>
								<div class="mask mask-2"></div>
								<div class="content">
									<h3>Fit Cross</h3>
									<p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
									<a href="#" class="info">Read More</a>
								</div>
							</div>
							 <div class="view view-ninth">
							   <a href="images/g6.jpg" class="b-link-stripe b-animate-go  swipebox"  title="Image Title"><img src="images/g6.jpg" alt="" class="img-responsive">
								<div class="mask mask-1"></div>
								<div class="mask mask-2"></div>
								<div class="content">
									<h3>Fit Cross</h3>
									<p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
									<a href="#" class="info">Read More</a>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
				</div>
			</div>
		</article>
	</div>
	<!--//gallery-->
	<!--start-contact-->
		<div class="se-slope" id="contact">
			<article class="se-content">
		    <div class="wrap">
			 <h3 class="tittle two">Contact</h3>
			 <div class="contact-form">
				  	   <form class="left_form">
					    	<div>
						    	<span><label>NAME</label></span>
						    	<span><input name="userName" type="text" class="textbox"></span>
						    </div>
						    <div>
						    	<span><label>E-MAIL</label></span>
						    	<span><input name="userEmail" type="text" class="textbox"></span>
						    </div>
						    <div>
						     	<span><label>Fax</label></span>
						    	<span><input name="userPhone" type="text" class="textbox"></span>
						    </div>
					    </form>
					    <form class="right_form">
					        <div>					    	
						    	<span><label>SUBJECT</label></span>
						    	<span><textarea name="userMsg"> </textarea></span>
						    </div>
						   <div>
						   		<input type="submit" value="Submit " />
						  </div>
					    </form>
					    <div class="clearfix"></div>
				  </div>

			</div>
	</article>
	</div>
	<!--contact-->	
	<div class="se-slope ">
		<article class="se-content lost">
			<!----footer--->
			<div class="footer">
				<div class="wrap">
				<div class="f-grids">
					<div class="col-md-4 footer-grid">
						<h3>Recent<span class="opening">Posts</span></h3>
						  <a href="#"><h5>The do’s and don’ts of running for fitness</h5></a>
						  <p>Sed rhoncus nulla turpis, vitae rutrum velit iaculis et. Curabitur vestibulum, erat non im</p>
						  <p class="month">April 1, 2014 , By <a href="#"> Robert Louise</a></p>
						  <a href="#"><h5>The do’s and don’ts of running for fitness</h5></a>
						  <p>Sed rhoncus nulla turpis, vitae rutrum velit iaculis et. Curabitur vestibulum, erat non im</p>
						   <p class="month">April 1, 2014 , By <a href="#"> Robert Louise</a></p>
						</div>
						<div class="col-md-4 footer-grid">
							<div class="opening_hours">
								 <ul class="times">
									<h3>Opening<span class="opening">Hours</span></h3>
									<li><i class="glyphicon glyphicon-time"> </i><span class="week">Monday</span><div class="hours">h.6:00-h.24:00</div>  <div class="clearfix"></div></li>
									<li><i class="glyphicon glyphicon-time"> </i><span class="week">Tuesday</span><div class="hours">h.6:00-h.24:00</div>  <div class="clearfix"></div></li>
									<li><i class="glyphicon glyphicon-time"> </i><span class="week">Wednesday</span><div class="hours">h.6:00-h.24:00</div>  <div class="clearfix"></div></li>
									<li><i class="glyphicon glyphicon-time"> </i><span class="week">Thrusday</span><div class="hours">h.6:00-h.24:00</div>  <div class="clearfix"></div></li>
									<li><i class="glyphicon glyphicon-time"> </i><span class="week">Friday</span><div class="hours">h.6:00-h.24:00</div>  <div class="clearfix"></div></li>
									<li><i class="glyphicon glyphicon-time"> </i><span class="week">Saturday</span><div class="hours">h.6:00-h.24:00</div>  <div class="clearfix"></div></li>
									<li><i class="glyphicon glyphicon-time"> </i><span class="week">Sunday</span><div class="hours">Closed</div>  <div class="clearfix"></div></li>
			
								 </ul>
							</div>
						</div>
						<div class="col-md-4 footer-grid">
								<h3>Contact<span class="opening">Info</span></h3>
							<ul class="address">
								 <li>123, new street, 129907 New Yark</li>
								 <li>023 456 23456</li>
								 <li><a class="mail" href="mailto:info@example.com">123 int@example.com</a></li>
							</ul>
							<div class="support">
								   <input type="text" class="text" value="Enter email... " onFocus="this.value = '';" onBlur="if (this.value == 'Enter email...') {this.value = 'Enter email...';}">
								<input type="submit" value="SUBMIT" class="botton">
									 <p>Lorem ipsum dolor sit amet conse aliqua. Ut enim ad minim veniam Lorem ctetur adipisicing .</p>
								</div>


						</div>
							<div class="clearfix"></div>
						</div>
						<div class="copy">
								<p>Copyright &copy; 2015.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
						</div>
					</div>
				</div>
			</article>
		</div>
  </section>
  <!--footer-->
    	<!--start-smooth-scrolling-->
						<script type="text/javascript">
									$(document).ready(function() {
										/*
										var defaults = {
								  			containerID: 'toTop', // fading element id
											containerHoverID: 'toTopHover', // fading element hover id
											scrollSpeed: 1200,
											easingType: 'linear' 
								 		};
										*/
										
										$().UItoTop({ easingType: 'easeOutQuart' });
										
									});
								</script>
		<a href="#home" id="toTop" class="scroll" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>


</body>
</html>